<template>
  <iframe v-if="iframeHtml && iframeHtml.length > 0" id="iframe" :src="iframeHtml" frameborder="0" style="width: 100%; height: 100vh"></iframe>
</template>

<script setup lang="ts">
import { getTestAPI } from "@/api/modules/nobleCharacter"
import { message } from "ant-design-vue"

//文件柜基础参数
interface paramsData {
  openType: string //类型 project为项目，必须有projectName字段、user 时候门户
  selectFileType: string //选择文件还是目录， file是文件
}

// 项目信息参数
interface Props {
  params: paramsData
  projectName?: string //项目令好，当openType为”project”必传
  projectType?: string //项目类型
  [propName: string]: any
}

const iframeHtml = ref<string>()
const props = withDefaults(defineProps<Props>(), {
  projectName: "",
  projectType: "",
})

const emits = defineEmits<{
  (e: "on-open-filecabinet-succ", res: any): void
  (e: "on-open-filecabinet-fail", err: any): void
}>()

//加载iframe 元素
const setIframeLoad = (val: string): void => {
  nextTick(() => {
    let iframe = document.getElementById("iframe") as HTMLIFrameElement
    emits("on-open-filecabinet-succ", val)
    if (iframe && iframe.attachEvent) {
      // IE下
      iframe.attachEvent("onload", () => {
        emits("on-open-filecabinet-succ", val)
      })
    } else {
      iframe.onload = () => {
        emits("on-open-filecabinet-succ", val)
      }
    }
  })
}

//打开景行文件柜
const openFileCabinet = async () => {
  try {
    const res = await getTestAPI()
    if (res?.data?.state) {
      let val = res?.data?.value
      iframeHtml.value = val
      setIframeLoad(val)
    } else {
      message.error(res.message)
      emits("on-open-filecabinet-fail", res)
    }
  } catch (err: any) {
    message.error(err.message)
    console.log("打开景行文件柜失败 ...", err)
    emits("on-open-filecabinet-fail", err)
  }
}

defineExpose({
  openFileCabinet,
})
</script>
